<!-- 文字交融 https://juejin.cn/post/7245316146336563261-->
<template>
	<div class="page">
		<div class="container">
			<span class="text">Duyi Education</span>
		</div>
	</div>
</template>

<script setup name=""></script>

<style lang="less" scoped>
	.page {
		background: #000;
	}
	.container {
		margin-top: 50px;
		text-align: center;
		background-color: #000;
		filter: contrast(30);
	}
	.text {
		font-size: 100px;
		letter-spacing: -50px;
		color: #fff;
		animation: showup 5s linear forwards;
	}
	@keyframes showup {
		0% {
			filter: blur(10px);
		}
		100% {
			letter-spacing: 10px;
			filter: blur(2px);
		}
	}
</style>
